<template>
    <div class="main-container">
        <div style="background-color: #fff; height:100%" id="customProp">
            <a-tabs   :lazy-load="true" type="card" @change="tabsChange" justify>
                <a-tab-pane title="特整工艺管理列表" key="1">
                    <SpecialProcessVue></SpecialProcessVue>
                </a-tab-pane>
                <a-tab-pane title="特整生产日报" key="2">
                    <SpecialProductionDailyReport></SpecialProductionDailyReport>
                </a-tab-pane>
            </a-tabs>
        </div>
    </div>
</template>

<script lang="ts">
import { defineComponent, reactive, ref, onMounted } from 'vue'
import emitter from '@/hooks/useEventBus'
import SpecialProcessVue from '@/components/Special/SpecialProcess.vue'
import SpecialProductionDailyReport from '@/components/Special/SpecialProductionDailyReport.vue'

export default defineComponent({
    name: 'SpecialProcess',
    components: { SpecialProcessVue,SpecialProductionDailyReport},
    setup() {

        const tabsChange = (e: string | number) => {
            emitter.emit('window-change')
        }

        return {
            tabsChange
        }
    }
})
</script>

<style scoped>
.main-container {
    height: 100%;
}
:deep(.ag-cell) {
    border-right: 1px solid #dde2eb;
}
:deep(.ag-header-cell){
    border-right: 1px solid #dde2eb;
}
:deep(.arco-table-th){
    border-right: 1px solid var(--color-neutral-3) ;
}
:deep(.arco-table-td){
    border-right: 1px solid var(--color-neutral-3) ;
}
</style>